<template>
	<view>
		<view class='Popup' v-if='isShowAuth && code && !showInputNickName'>
			<view class="logo-auth">
				<image :src='logoUrl' mode="aspectFit"></image>
			</view>
			<view class='title'>授权提醒</view>
			<view class='tip'>请授权头像等信息，以便为您提供更好的服务</view>
			<!-- #ifdef MP-WEIXIN -->
				<jade-mp-privacy></jade-mp-privacy>
			<!-- #endif -->
			<view class='bottom flex'>
				<view class='item' @click='close'>随便逛逛</view>
				<!-- #ifdef APP-PLUS -->
				<button class='item grant' @click="setUserInfo">去授权</button>
				<!-- #endif -->
				<!-- #ifdef MP -->
				<button v-if="canUseGetUserProfile" class="item grant" hover-class="none"
					@tap="getUserProfile">去授权</button>
				<button v-else class='item grant' type="primary" open-type="getUserInfo" lang="zh_CN"
					@getuserinfo="setUserInfo">去授权</button>
				<!-- #endif -->
			</view>
		</view>
		
		<!-- begin 微信收回wx.getUserProfile能力，重新获得用户昵称 -->
		<view class='Popup' v-if="isShowAuth && code && showInputNickName" style="padding: 40rpx; border-radius: 20rpx;">
			<view>
				<view style="padding-bottom: 20rpx; font-weight: bold;">请选择头像：</view>
				<button class="avatar-wrapper" open-type="chooseAvatar" @chooseavatar="onChooseAvatar">
				  <image class="avatar" :src="avatarUrl" style="width: 180rpx; height: 180rpx; margin-top:0px"></image>
				</button> 
			</view>
			<view style="margin-top: 20rpx;">
				<text style="padding-right: 20rpx; font-weight: bold;">昵称：</text>
				<input type="nickname" class="weui-input" placeholder="请输入昵称" v-model="nickname" style="text-indent: 2em;"/>
			</view>
			
			<button @tap="onTapOK" style="margin-top: 30rpx; background-color: #e54d42; color: white; padding: 4px;">确定</button>
		</view>
		<!-- end -->
		
		<view class='mask' v-if='isShowAuth && code' @click='close'></view>
	</view>
</template>

<script>
	// +----------------------------------------------------------------------
	// | CRMEB [ CRMEB赋能开发者，助力企业发展 ]
	// +----------------------------------------------------------------------
	// | Copyright (c) 2016~2021 https://www.crmeb.com All rights reserved.
	// +----------------------------------------------------------------------
	// | Licensed CRMEB并不是自由软件，未经许可不能去掉CRMEB相关版权
	// +----------------------------------------------------------------------
	// | Author: CRMEB Team <admin@crmeb.com>
	// +----------------------------------------------------------------------
	const app = getApp();
	import Cache from '../utils/cache';
	import {
		getLogo
	} from '../api/public';
	import {
		LOGO_URL
	} from '../config/cache';
	import {
		mapGetters
	} from 'vuex';
	import Routine from '../libs/routine';

	// begin 微信收回wx.getUserProfile能力，重新获得用户昵称
	// import {
	// 	updateUserNickname
	// } from '../api/user'; // 不知道为什么php添加了路由也报404，所以移到java中实现了
	import {
		updateUserNickname
	} from '../api/fsh';
	import {TOKENNAME, HTTP_REQUEST_URL} from '@/config/app.js';
	// end
	
	const defaultAvatar = 'https://mmbiz.qpic.cn/mmbiz/icTdbqWNOwNRna42FI242Lcia07jQodd2FJGIYQfG0LAJGFxM4FbnQP6yfMxBgJ0F3YRqJCJ1aPAK2dQagdusBZg/0';
	export default {
		name: 'Authorize',
		props: {
			isAuto: {
				type: Boolean,
				default: true
			},
			isGoIndex: {
				type: Boolean,
				default: true
			},
			isShowAuth: {
				type: Boolean,
				default: false
			}
		},
		data() {
			return {
				logoUrl: app.globalData.routine_logo,
				canUseGetUserProfile: false,
				code: null,
				
				// begin 微信收回wx.getUserProfile能力，重新获得用户昵称
				showInputNickName: false,
				nickname: '',
				avatarUrl: defaultAvatar
				// end
			}
		},
		computed: mapGetters(['isLogin', 'userInfo']),
		watch: {
			isLogin(n) {
				n === true && this.$emit('onLoadFun', this.userInfo);
			},
			isShowAuth(n) {
				console.log("Authorize| watch isShowAuth: "+n)
				if (n) {
					uni.showLoading({
						title: '正在登录中'
					});
					Routine.getCode().then(code => {
						uni.hideLoading();
						this.code = code;
						console.log("Authorize| code="+code);
					}).catch(e => {
						uni.hideLoading();
						uni.showToast({
							title: '登录失败',
							duration: 2000
						});
					})
				} else {
					this.code = null;
				}
			}
		},
		created() {
			if (wx.getUserProfile) {
				this.canUseGetUserProfile = true
			}
			this.getLogoUrl();
			this.setAuthStatus();
			uni.$on('update', (data) => {
				this.logoUrl = data.login_logo
			})
		},
		mounted: function() {
			this.$nextTick(() => {
				this.logoUrl = app.globalData.login_logo
			});
		},
		methods: {
			setAuthStatus() {
				Routine.authorize().then(res => {
					if (res.islogin === false) {
						console.log("Authorize| setAuthStatus, this.userInfo:", this.userInfo);
						this.$emit('onLoadFun', this.userInfo);
					}
				}).catch(res => {
					if (this.isAuto)
						this.$emit('authColse', true);
				})
			},
			getUserInfo(code) {
				console.log("Authorize| getUserInfo, code:", code);
				Routine.getUserInfo().then(res => {
					let userInfo = res.userInfo
					userInfo.code = code;
					userInfo.spread_spid = this.$Cache.get("spread") || app.globalData.spid; //获取推广人ID
					userInfo.spread_code = app.globalData.code; //获取推广人分享二维码ID
					
					// begin 微信收回wx.getUserProfile能力，重新获得用户昵称
					console.log("Authorize| getUserInfo, userInfo:", userInfo);
					if(userInfo.userInfo.nickName == '微信用户') {
						this.showInputNickName = true;
						this.__authUserInfo = userInfo;
						return;
					}
					// end
					
					
					Routine.authUserInfo(userInfo).then(res => {
						uni.hideLoading();
						this.$emit('authColse', false);
						this.$emit('onLoadFun', this.userInfo);
					}).catch(res => {
						uni.hideLoading();
						uni.showToast({
							title: res.msg,
							icon: 'none',
							duration: 2000
						});
					})
				}).catch(res => {
					uni.hideLoading();
				})
			},
			getUserProfile() {
				let self = this;

				console.log("Authorize| getUserProfile, this.code:", this.code);
				Routine.getUserProfile()
					.then(res => {
						let userInfo = res.userInfo;
						userInfo.code = this.code;
						userInfo.spread_spid = app.globalData.spid; //获取推广人ID
						userInfo.spread_code = app.globalData.code; //获取推广人分享二维码ID
						
						// begin 微信收回wx.getUserProfile能力，重新获得用户昵称
						console.log("Authorize| getUserProfile, userInfo:", userInfo);
						if(userInfo.userInfo.nickName == '微信用户') {
							this.showInputNickName = true;
							this.__authUserInfo = userInfo;
							return;
						}
						// end
						Routine.authUserInfo(userInfo)
							.then(res => {
								console.log("Authorize| Routine.authUserInfo, res:", res);
								
								if (res.data.key !== undefined && res.data.key) {
									uni.hideLoading();
									self.authKey = res.data.key;
									self.isPhoneBox = true;
								} else {
									uni.hideLoading();
									let time = res.data.expires_time - self.$Cache.time();
									self.$store.commit('LOGIN', {
										token: res.data.token,
										time: time
									});
								}
							})
							.catch(res => {
								uni.hideLoading();
								uni.showToast({
									title: res.msg,
									icon: 'none',
									duration: 2000
								});
							});
					})
					.catch(res => {
						uni.hideLoading();
					});

			},

			setUserInfo() {
				uni.showLoading({
					title: '正在登录中'
				});
				this.getUserInfo(this.code);
				this.$emit('authColse', false);
			},
			getLogoUrl() {
				this.logoUrl = app.globalData.routine_logo
				// let that = this;
				// if (Cache.has(LOGO_URL)) {
				// 	this.logoUrl = Cache.get(LOGO_URL);
				// 	return;
				// }
				// getLogo().then(res=>{
				// 	that.logoUrl = res.data.logo_url
				// 	Cache.set(LOGO_URL,that.logoUrl);
				// })
			},
			close() {
				let pages = getCurrentPages(),
					currPage = pages[pages.length - 1];
				if (this.isGoIndex) {
					uni.switchTab({
						url: '/pages/index/index'
					});
				} else {
					this.$emit('authColse', false);
				}
				// if (currPage && currPage.isShowAuth != undefined){
				// 	currPage.isShowAuth = true;
				// }
			},
			
			// begin 微信收回wx.getUserProfile能力，重新获得用户昵称
			onChooseAvatar(e) {
				this.avatarUrl = e.detail.avatarUrl;
				console.log("onChooseAvatar: ", e);
			},
			onTapOK() {
				if(!this.nickname) {
					uni.showToast({
						title: "用户呢称不能为空",
						icon: 'none',
						duration: 2000
					});
					return;
				}
				if(!this.avatarUrl || this.avatarUrl == defaultAvatar) {
					uni.showToast({
						title: "头像不能为空",
						icon: 'none',
						duration: 2000
					});
					return;
				}
				
				uni.showLoading({
					title: '正在保存中'
				});
				
				Routine.authUserInfo(this.__authUserInfo)
				.then(res => {
					console.log("Authorize| Routine.authUserInfo 2, res:", res);
					
					uni.uploadFile({
						url: HTTP_REQUEST_URL + '/api/upload/avatar/field',
						filePath: this.avatarUrl,
						name: 'field',
						formData: {
							'filename': 'avatar_'+res.data.user.uid
						},
						header: {
							// #ifdef MP
							"Content-Type": "mulMyTipart/form-data",
							// #endif
							[TOKENNAME]: 'Bearer ' + res.data.token
						},
						success: (uploadFileRes) => {
							console.log(uploadFileRes.data);
							let imgData = JSON.parse(uploadFileRes.data)
							
							console.log("Authorize| 2update user nickname and avatar, avatarUrl="+imgData.data.path);
							console.log(res.data.user.uid)
							console.log(this.nickname)
							console.log(imgData.data.path)
							updateUserNickname(res.data.user.uid, this.nickname, imgData.data.path).then(res=>{
								console.log("avatar",res)
							}).catch(res=> {
								console.log("Authorize| update user nickname and avatar fail, res:", res);
								uni.hideLoading();
								uni.showToast({
									title: res.msg,
									icon: 'none',
									duration: 2000
								});
							})
							
						},
						complete(res) {
							console.log(res)
						}
					});	
					
					if (res.data.key !== undefined && res.data.key) {
						uni.hideLoading();
						self.authKey = res.data.key;
						self.isPhoneBox = true;
					} else {
						uni.hideLoading();
						let time = res.data.expires_time - self.$Cache.time();
						self.$store.commit('LOGIN', {
							token: res.data.token,
							time: time
						});
					}
				})
				.catch(res => {
					uni.hideLoading();
					uni.showToast({
						title: res.msg,
						icon: 'none',
						duration: 2000
					});
				});
			}
			// end
		}
	}
</script>

<style scoped lang='scss'>
	.Popup {
		width: 500rpx;
		background-color: #fff;
		position: fixed;
		top: 50%;
		left: 50%;
		margin-left: -250rpx;
		transform: translateY(-50%);
		z-index: 1000;
	}

	.Popup {
		.logo-auth {
			z-index: -1;
			position: absolute;
			left: 50%;
			top: 0%;
			transform: translate(-50%, -50%);
			width: 150rpx;
			height: 150rpx;
			display: flex;
			align-items: center;
			justify-content: center;
			border: 8rpx solid #fff;
			border-radius: 50%;
			background: #fff;
		}

		image {
			height: 42rpx;
			margin-top: -54rpx;
		}
	}

	.Popup .title {
		font-size: 28rpx;
		color: #000;
		text-align: center;
		margin-top: 30rpx
	}

	.Popup .tip {
		font-size: 22rpx;
		color: #555;
		padding: 0 24rpx;
		margin-top: 25rpx;
	}

	.Popup .bottom .item {
		width: 50%;
		height: 80rpx;
		background-color: #eeeeee;
		text-align: center;
		line-height: 80rpx;
		font-size: 24rpx;
		color: #666;
		margin-top: 54rpx;
	}

	.Popup .bottom .item.on {
		width: 100%
	}

	.flex {
		display: flex;
	}

	.Popup .bottom .item.grant {
		font-size: 28rpx;
		color: #fff;
		font-weight: bold;
		background-color: #e93323;
		border-radius: 0;
		padding: 0;
	}

	.mask {
		position: fixed;
		top: 0;
		right: 0;
		left: 0;
		bottom: 0;
		background-color: rgba(0, 0, 0, 0.65);
		z-index: 999;
	}
</style>
